<template>
  <div class="approve" @click.stop>
      <!-- <div v-if="type==='1' || type==='2'" class="docu">
          <div class="resTitle">审批意见</div>
          <div>
              <b v-if="type==='1'">同意</b>
              <b v-if="type==='2'">拒绝</b>
          </div>
      </div> -->
     
      <div class="textArea">
        <textarea type="textarea" v-model="comment" refs="areaInput" :placeholder="placeholder" rows="3" style="" cols="20" class="leaveDesc">
        </textarea>
      </div>


      <button class="btn" :class="{'submitColor':submitColor}" @click="beforeCheck">确定<template v-if="type==='1'">同意</template><template v-if="type==='2'">驳回</template></button>
      
  </div>
</template>

<script>
import Vue from 'vue'
import {Toast,MessageBox} from 'mint-ui'

export default {
  name: 'app',
  data() {
    return {
        comment:''
    };
  },
  computed:{
      placeholder:function(){
          switch(this.type){
              case '1':
                  return '请填写审批意见';
                  break;
              case '2':
                  return '请填写审批意见';
                  break;
              case '3':
                  return '想说点什么呢';
                  break;
              case '4':
                  return '请输入转交备注';
                  break;
              default:
                  return "请输入审批意见";
                  break;
          }
      }
  },
  props:['type','submitColor','comfirmAppro','value'],
  methods: {
    submitStartState: function() {
      this.isSubmitIng = true;
      this.submitColor = true;
    },

    submitEndState: function() {
      this.isSubmitIng = false;
      this.submitColor = false;
    },

    beforeCheck:function(){
        this.$emit('input',this.comment);
        Vue.nextTick(()=>{
            this.$emit('comfirmAppro');
        })
    }


  },
  components: {


  },
  watch: {

  },
  created:function(){

  },
  mounted: function() {

  }
};
</script>

<style lang="less" scope="scope">
.approve {
  font-family:   "Microsoft YaHei", "微软雅黑";
  font-size: 0.28rem;
  position: absolute;
  width: 100%;
    background: #fff;
    z-index: 10000;
    bottom: 0;
  textarea {
    width: 100%;
    resize: none;
    display: inline-block;
    font-size: 0.36rem;
    line-height: 0.6rem;
    height: 0.6rem;
    border: none;
    height: 3rem;
    background-color: transparent;
    border: none; // margin-top:-0.1rem;
    padding: 0 0;
    vertical-align: top;
  }
  textarea::-webkit-input-placeholder {
    color: #aaa;
    font-size:0.28rem;
    line-height: 0.6rem;
    height: 0.6rem;
    font-weight: normal;
    text-align: left;
  }
  textarea:focus {
    outline: none;
  }


  .textArea{
    background-color:#fff;
    padding-left: 0.3rem;
    padding-top:0.3rem;
  }
  .btn {
    width: 80%;
    height: 1rem;
    border: none;
    margin: 0.3rem 10%;
    outline: none;
    font-size: 0.32rem;
    font-weight: 600;
    color: #fff;
    border-radius: 0.5rem;
    background-color: #007de4;
  }
  button.submitColor {
    background-color: #2872af;
  }

}


</style>
<style>
body .mint-msgbox-btns button{
  font-size:0.4rem;
}
</style>

